<template>
    <span id="showtime" ref="time">{{GetMin}}</span>
</template>

<script>
import {GetTime} from '@/assets/js/GetTime.js'


export default {
    name:'showtime',
    data() {
        return {
            time:"",
        };
    },
    props:{
        starttime:{
            type:String,
            required:true,
            validator: function (value) {
             let values=new Date(value).getTime() ;
             let time=new Date(GetTime()).getTime();
             try{
                if(values>time){
                    throw "date is error"
                }
                else{
                    return values;
                }
             }
             catch(error){
                console.log(error)
             }
            },
        }
    },
    methods: {
        addzero(num,m){
            return ((Array(m).join(0)+num).slice(-m));
        }
      
    },
    mounted(){
        let timer=setInterval(()=>{
            this.time=GetTime();
        },1000)
    },
    computed:{
        ShowTime(){
            if(this.time){
              let time=new Date(this.time).getTime()-new Date(this.starttime).getTime();
              return time;
            }
        },
        GetMin(){
           let min=this.ShowTime/1000;
           let mins=0;
           let hours=0;
           let day=0;
           let mounth=0;
           let year=0;
           while(min>=60){
               mins+=1;
               min-=60;
           }
           while(mins>=60){
               hours+=1;
               mins-=60;
           }
           while(hours>=24){
               day+=1;
               hours-=24;
           }
           while(day>=31){
               mounth+=1;
               day-=30;
           }
           while(mounth>=13){
               year+=1;
               mounth-=12;
           }
           
           year<=0?year="":year=year+"年";
           mounth<=0?mounth="":mounth=mounth+"月";
           day<=0?day="":day=day+"天";
           hours<=0?hours="":hours=hours+"小时";
           mins<=0?mins="":mins=this.addzero(mins,2)+"分钟";
           min=this.addzero(min,2)+"秒";
         
           return `${year}${mounth}${day}${hours}${mins}${min}`;
        }
    },
    beforeDestory(){
        clearInterval(timer);
    }
}
</script>

<style scoped>

</style>